<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="font/iconfont.css" />
		<style type="text/css">
			.icon-zan1{
				font-size: 50px;
				color: blue;
				-webkit-filter:drop-shadow(5px 5px 5px red);
				position: fixed;
				top: 50%;
				left: 50%;
				margin-left: -25px;
				opacity: 1;
			}
		</style>
		<script src="js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				$("i").click(function(){
					var i = $(this).clone();
					i.css("color","rgb("+Math.floor(Math.random()*256)+","+Math.floor(Math.random()*256)+","+Math.floor(Math.random()*256)+")");
					i.appendTo($("body"));
					i.animate({
						top:"35%",
						left:"48%"
					},500,"linear",function(){
						i.animate({
							top:"20%",
							left:"52%",
							opacity:0
						},500,"linear",function(){
							i.remove();
						})
					})
					
				})
			})
		</script>
	</head>
	<body>
		<i class="icon iconfont icon-zan1"></i>
	</body>
</html>
